/*
 Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 SPDX-License-Identifier: Apache-2.0
*/

@use '../internal/styles' as styles;
@use '../internal/styles/tokens' as awsui;

$dropdown-trigger-icon-offset: 2px;

.button-dropdown {
  display: inline-block;

  &.full-width {
    inline-size: 100%;
    display: block;
  }
}

.items-list-container {
  padding-block: 0;
  padding-inline: 0;
  margin-block: 0;
  margin-inline: 0;

  @include styles.with-motion {
    animation: awsui-motion-fade-in-0 500ms awsui.$motion-easing-show-quick;
    animation-fill-mode: none;
  }
}

.rotate {
  @include styles.spin-180-when-open;
}

.header {
  display: flex;
  flex-direction: column;
  list-style: none;
  padding-block: awsui.$space-s;
  padding-inline: awsui.$space-l;
  border-block-start: awsui.$border-width-dropdown solid transparent;
  border-block-end: awsui.$border-width-dropdown solid awsui.$color-border-dropdown-group;
  border-inline: awsui.$border-width-dropdown solid transparent;
}

.title,
.description {
  color: awsui.$color-text-top-navigation-title;
}

.trigger-button {
  &.full-width {
    display: grid;
    grid-template-columns: 1fr auto;

    &.loading {
      grid-template-columns: auto 1fr auto;
    }
  }
}

.split-trigger-wrapper {
  display: flex;

  & > .trigger-item {
    & > .trigger-button:focus,
    & > .trigger-button:hover {
      z-index: 1;
    }
  }

  & > .trigger-item:not(:last-child) {
    & > .trigger-button {
      border-start-end-radius: 0;
      border-end-end-radius: 0;
      padding-inline-end: awsui.$space-m;
      margin-inline-end: awsui.$space-xxxs;

      &.has-no-text {
        padding-inline: awsui.$space-button-icon-only-horizontal;

        &.visual-refresh {
          padding-inline-start: calc(#{awsui.$space-s} - #{$dropdown-trigger-icon-offset});
        }
      }
    }
  }

  & > .trigger-item:not(:first-child) {
    & > .trigger-button {
      border-start-start-radius: 0;
      border-end-start-radius: 0;
      padding-inline: calc(#{awsui.$space-xs} - #{$dropdown-trigger-icon-offset});
    }

    &.visual-refresh {
      & > .trigger-button {
        padding-inline-end: calc(#{awsui.$space-s} - #{$dropdown-trigger-icon-offset});
      }
    }
  }

  & > .trigger-item.variant-normal {
    &:not(:last-child) > .trigger-button {
      margin-inline-end: 0;
    }

    &:not(:first-child) > .trigger-button {
      margin-inline-start: calc(#{awsui.$border-width-button} * -1);
    }
  }
}
.split-trigger {
  display: contents;
}
.dropdown-trigger {
  display: contents;
}

.main-action-full-width {
  flex: 1 1 0;
}

.main-action-trigger-full-width {
  flex: 0 0 auto;
}

.test-utils-button-trigger {
  /* used in test-utils */
}
